// 一般 HTML 控件的数据绑定
define(function(require, exports, module) {
	var optionTpl 			= '<option value="{id}">{name}</option>',
		optionTpl_selected	= '<option value="{id}" selected>{name}</option>';
	
	/**
	 * 下拉列表
	 * @param {Array|JSON} arrData 当 Arr 类型，不包含额外的参数（纯数据）；当 JSON 类型时，可以传人数据映射的参数。
	 * @param {Function|String|Number} selectFn 下拉列表怎么选中。若 String | Number 时，与 id 字段匹配。
	 */
	exports.dorpdownlist = function(arrData, selectFn){
		var mapping;
		if(arrData instanceof Array){
			mapping = {
				id : 'id', name : 'name'
			};
		}else{
			mapping = arrData.mapping;
			arrData = arrData.arrData || arrData.data;
		}
		
		var data, isSelected = false, str, strs = [];
		for(var i = 0, j = arrData.length; i < j; i++){
			data = arrData[i];
			
			// 是否选中
			if(typeof selectFn == 'function'){
				isSelected = selectFn(data, i, optionTpl, arrData);
			}else if(typeof selectFn == 'string' || typeof selectFn == 'number'){
				isSelected = (selectFn == data[mapping.id]);
			}
			
			str = (isSelected ? optionTpl_selected : optionTpl).format({
				id : data[mapping.id], 
				name : data[mapping.name]
			});
			strs.push(str);
		}
		
		return strs.join('\n');
	}
	
	exports.ul_list = function (json, xhr, tplEl, dataKey, renderer, cb){
		var data = json[dataKey], j = data.length;
		var tpl = tplEl.innerHTML, lis = [];
		
		if(j == 0){
			tplEl.innerHTML = '没有数据哦~';
		}else{
			for(var i = 0 ; i < j; i++){
				var _data = renderer ? renderer(data[i]) : data[i];
				lis.push(tpl.format(_data));
			}
			tplEl.innerHTML = lis.join('');
		}
		
		cb && cb();
	}
	
	exports.list = function (json, xhr, dataKey, tplEl, tpl, renderer){
		var data = json[dataKey], j = data.length;
		var lis = [];
		
		if(j == 0){
			tplEl.innerHTML = '没有数据哦~';
		}else{
			for(var i = 0 ; i < j; i++){
				var _data = renderer ? renderer(data[i]) : data[i];
				
				if(_data === false)continue; // 返回 false 则跳过该记录，不会被渲染
				lis.push(tpl.format(_data));
			}
			tplEl.innerHTML = lis.join('');
		}
	}
	
	exports.binding = function(url, args, dataKey, el, tpl, renderer, isJSONP){
		if(typeof el == 'string')el = document.querySelector(el);
		var cb = exports.list.delegate(null, null, dataKey, el, tpl, renderer);
		bf.data.get(url, args, cb);
	}
	
	/**
	 * @param {String}
	 */
	exports.getTpl = function(cssSelector){
		var el = document.querySelector(cssSelector);
		if(!el){
			throw '找不到模板元素：' + cssSelector;
		}
		return el.value;
	}
	
	/**
	 * 工序：1、遍历每一个数据对象；2、格式化到字符串
	 */
	exports.renderItem = function(arr, tpl, itemHanlder, isAsArr){
		var lis = [], data;
		for(var i = 0, j = arr.length; i < j; i++){
			li = arr[i];
			li = itemHanlder(li);
			li = tpl.format(li);
			lis.push(li);
		}
		
		return lis.join('\n');
	}
	
	// 分页用
	exports.appendChild = function(arr, tpl, itemHanlder, container){
		var data;
		for(var i = 0, j = arr.length; i < j; i++){
			li = arr[i];
			li = itemHanlder(li);
			li = tpl.format(li);
			var fragDiv = document.createElement('div');
			fragDiv.innerHTML = li;
			container.appendChild(fragDiv.getChildren()[0]);

			fragDiv = null;
		}
	}
});